import request from '../../utils/request'
Page({
  // 获取视频导航标签名
  async getGroupList() {
    const res = await request({
      url: "/video/group/list"
    })
    if (res.code === 200) {
      this.setData({
        GroupList: res.data.slice(0, 20)
      })
    }
  },

  //获取视频标签下对应的视频数据
  async getVideoData() {
    const res = await request({
      url: "/video/group",
      data: {
        id: this.data.tapId //根据导航的id获取对应数据
      }
    })
    console.log(res)
    //把数据放到data
    this.setData({
      videoList: res.datas
    })
  },
  //导航标签点击事件，用来保存当前id到tapId，用于判断active显示
  navText(e) {
    const reg=/\d+/g
    console.log(e.target.id.match(reg))
    this.setData({
      tapId: e.target.id.match(reg)[0]
    })
    //点击nav更新tapId获取当前的数据
    this.getVideoData()
  },

  //视频点击事件
  // videoClick(e) {
  //   if (e.target.id === this.data.videoId) {
  //     //点击的是同一个视频就会走到这
  //     //储存的id和点击的相同并且实例已经存在了,暂停播放(也就是上一个暂停)
  //     this.videoContext.pause()
  //     //让保存的id回到初始，保证下次点击是走else，else只有播放当前和暂停上一个
  //     this.setData({
  //       videoId: ''
  //     })
  //   } else {
  //     //videoId为空和之后点击不同视频会走下面
  //     //如果实例已经存在表示不是第一次点击了
  //     if (this.videoContext) {
  //       // 让实例暂停(就是上一个，或者是一个已经暂停的同一个)
  //       this.videoContext.pause()
  //       //保存最新的vid，并且创建新的实例然后开始播放
  //       this.setData({
  //         videoId: e.target.id
  //       })
  //       //创建当前视频的新的实例，并开始播放
  //       this.videoContext = wx.createVideoContext(this.data.videoId)
  //       this.videoContext.play()
  //     } else { //实例不存在，只有第一次点击会走到这
  //       // 保存vid
  //       this.setData({
  //         videoId: e.target.id
  //       })
  //       //创建当前视频的实例
  //       this.videoContext = wx.createVideoContext(this.data.videoId)
  //       //先跳再播
  //       this.Progress(e)
  //       this.videoContext.play()
  //     }
  //   }
  // },
  videoClick(e) {
    if (!this.data.videoId) { //第一次点击
      this.setData({
        videoId: e.target.id
      })
      this.videoContext = wx.createVideoContext(this.data.videoId)
      this.videoContext.play()
      //记录视频播放状态
      this.videoState = true
    } else {
      if (this.data.videoId === e.target.id) { //点击同一个
        if (this.videoState) { //是播放
          //暂停并且记录状态
          this.videoContext.pause()
          this.videoState = false
        } else { //是暂停
          // 播放并且记录状态
          this.videoContext.play()
          this.videoState = true
        }
      } else { //点击的不是同一个
        this.setData({
          videoId: e.target.id
        })
        setTimeout(() => { //保证视频已经加载完成
          this.videoContext = wx.createVideoContext(this.data.videoId)
          this.Progress(e)
          this.videoContext.play()
          this.videoState = true
        }, 500)
      }
    }
  },

  //专门负责跳到记录的视频进度的
  Progress(e) {
    //查找是否有记录
    const matchingIdObj = this.data.videoTime.find((item) => {
      return item.id === e.target.id
    })
    if (matchingIdObj) { //有记录就seek，没有就什么也不做
      const currentTime = matchingIdObj.detail.currentTime
      this.videoContext.seek(currentTime)
    }
  },
  //点击图片切换视频
  // handoffState(e) {
  //   this.setData({
  //     handoff: e.target.id
  //   })
  // },
  //进度条变化事件
  timeupdata(e) {
    //先定一个记录时间的初始数据并获得
    const videoTime = this.data.videoTime
    //保存当前数据
    const timeObj = {
      id: e.target.id,
      detail: e.detail
    }
    //查找记录中是否有这个相同id的数据
    const videoTimeItem = this.data.videoTime.find((item) => {
      return item.id === timeObj.id
    })
    if (videoTimeItem) { //如果有就更新
      //只能修改对象中的数据，不能直接修改对象
      videoTimeItem.detail = timeObj.detail
    } else { //没有就新增
      videoTime.push(timeObj)
      this.setData({
        videoTime
      })
    }
  },
  //下拉刷新事件触发
  bindrefresherrefreshEvent() {
    //更新数据
    // setTimeout(()=>{
    //   this.setData({
    //     flushed:false
    //   })
    // },1000)
    this.getVideoData()
    this.setData({
      flushed: false
    })
  },
  /**
   * 页面的初始数据
   */
  data: {
    GroupList: [],
    tapId: 58100,
    videoList: [],
    videoId: '', //控制视频的播放和暂停
    // handoff: '', //控制图片和视频的切换
    videoTime: [], //视频播放时间
    flushed: true //下拉刷新的状态
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.getGroupList()
    this.getVideoData() //初始的video数据
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})